<#include "/layout/layout.ftl">
<@body>
<link href="/css/toolPage.css" rel="stylesheet"/>
<link href="/lib/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet"/>
<script src="/lib/bootstrap-select/js/bootstrap-select.min.js"></script>
<link href="/lib/jsoneditor/css/jsoneditor.min.css" rel="stylesheet"/>
<script src="/lib/jsoneditor/js/jsoneditor.min.js"></script>
<script src="/script/tool/dubbo.js"></script>
<script src="/script/tool/jsonEditorUtil.js"></script>
<script src="/script/testcase/dubboTestCase.js"></script>
    <form method="post" action="/testCase/saveTestCase" class="form-horizontal">
        <div class="form-group">
            <label class="col-md-2 control-label">用例名称：</label>
            <div class="col-md-5">
                <input id="testCaseName" type="text" name="testCaseName" class="form-control" value="${testCaseName!}" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-2 control-label">断言类型：</label>
            <div class="col-md-2">
                <select class="form-control" name="assertType" id="assertType" onchange="switchExpression(this.value)">
                    <option value="1"<#if assertType?? && assertType =1> selected</#if>>全文匹配</option>
                    <option value="2"<#if assertType?? && assertType =2> selected</#if>>包含</option>
                    <option value="3"<#if assertType?? && assertType =3> selected</#if>>不包含</option>
                    <option value="4"<#if assertType?? && assertType =4> selected</#if>>jsonPath</option>
                    <option value="5"<#if assertType?? && assertType =5> selected</#if>>xPath</option>
                    <option value="6"<#if assertType?? && assertType =6> selected</#if>>正则</option>
                </select>
            </div>
            <div class="col-md-5">
                <input type="hidden" name="id" value="${id!}" >
                <input type="hidden" name="interfaceId" value="${Session.interfaceId!}">
                <input type="hidden" name="interfaceType" value="${Session.interfaceType!}">
                <input type="hidden" id="expressionIndex"  value="0">
                <input type="hidden" name="paramValue" id="paramValue">
                <input type="hidden" name="expectResult" id="expectResult">
                <input type="hidden" name="expression" id="expression">
                <input type="button" onclick="invokeForTestCase()" value="调用一次" class="btn btn-primary">
                <input type="submit" onclick="" value="保存" class="btn btn-primary">
                <input type="button" value="保存新增并下一条" class="btn btn-primary">
                <input type="button" id="expressionBtn" onclick="addExpression()" value="增加断言表达式" class="btn btn-primary">
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <label class="col-md-2 control-label">表达式：</label>
                <div id="expressionDiv" class="col-md-5">

                </div>
                <#--<input type="text" placeholder="表达式" />-->

            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="col-md-6">
                    <h4>入参:
                        <span style="color: red">方法参数解释:0代表是第一个参数，1代表第二个参数，以此类推</span>
                    </h4>
                </div>
                <div class="col-md-6">
                    <h4>预期结果:</h4>
                </div>
            </div>
        </div>
        <div class="row" style="height: 64%">
            <div class="col-md-12">
                <div class="col-md-6">
                    <div id="param">
                    </div>
                </div>
                <div class="col-md-6">
                    <div id="result">

                    </div>
                </div>
            </div>
        </div>
    </form>
<script type="text/javascript">
    var paramJsonEditor;
    var resultJsonEditor;
    $(function () {
        $("#expressionBtn").hide();
        paramJsonEditor =initJsonEditor("param","tree");
        resultJsonEditor =initJsonEditor("result","tree");
        <#if paramModel??>
            var paramModelStr ='${paramModel}';
            var paramObj=JSON.parse(paramModelStr);
            paramJsonEditor.set(paramObj);
        </#if>
        <#if paramValue??>
            var paramValueStr ='${paramValue}';
            var paramObj=JSON.parse(paramValueStr);
            paramJsonEditor.set(paramObj);
        </#if>
         <#if expectResult??>
            var expectResultStr ='${expectResult}';
            var resultObj=JSON.parse(expectResultStr);
            resultJsonEditor.set(resultObj);
         </#if>
        <#if expression?? >
            var expectResultStr='${expression}';
            var expressionObj=JSON.parse(expectResultStr);
            backWriteExpression(expressionObj);
        </#if>
        $("form").submit(function () {
           var param=JSON.stringify(paramJsonEditor.get());
           $("#paramValue").val(param);
           var result =JSON.stringify(resultJsonEditor.get());
           $("#expectResult").val(result);
           writeExpression();
        });
    });
</script>
</@body>